import {defineStore} from "pinia";

// 在整个前端工程中，共享数据可以有很多组
// 所以每一组都需要一个唯一的 id 值，用于和其它组彼此区分
const id = "carStoreId";

// 创建 store 对象所需的配置项
// options 中包括：state、getters、actions
const options = {
    // state 属性：作用是定义核心共享数据，需要赋值一个函数，强烈建议使用箭头函数
    state: () => {
        // 当前函数的返回值就是 Pinia 要维护的核心共享数据
        return {
            carEngine: {
                engineName: "发动机名称[未设定]",
                enginePrice: 0.0
            },
            carShell: {
                shellColor: "外壳颜色[未设定]",
                shellPrice: 0.0
            }
        }
    },

    // getters 属性：对外提供可以直接访问的属性名
    // getters 中定义的属性，在外面就按照属性名形式使用，而不是调用函数
    // getters 属性中定义属性时尽量不要修改原始数据，尽量只做读操作，但是可以基于原始数据进行计算
    getters: {
        summaryPrice: state => state.carEngine.enginePrice * 1 + state.carShell.shellPrice * 1
    },
    actions: {
        addShell: function (shellColor, shellPrice) {
            // 这里为什么一定要使用 function 声明的函数呢？
            // 因为这里我们只能通过 this 关键词引用共享数据，箭头函数就无法通过 this 引用共享数据了
            this.carShell.shellColor = shellColor;
            this.carShell.shellPrice = shellPrice;
        }
    }
};

export default defineStore(id, options);